<template>
	<div>
			<ul class="item-box"  v-if="dataList.length > 0">
				<li class="item" v-for="(item, index) in dataList" :key="index">
					<div class="f-between">
						<div @click="handleShowDetail(item)">
							<p class="f14" style="color: #000; font-weight: 700; font-size: 1rem">
								{{ api == 'view_dpGatherForm_page' ? item.batchNumber : item.id }}
							</p>
							<p style="margin: 5px 0; color: #000; font-weight: 400; opacity: 0.5">{{ item.dataTypeName }}</p>
							<p v-if="item.gatherStatus == 4" class="f14 text-gray" style="color: #000; font-weight: 400; opacity: 0.8">点击下载失败数据</p>
						</div>
						<div style="display: flex; flex-flow: column">
							<TagList v-bind="getTagConig(item)"></TagList>
							<el-button v-if="item.gatherStatus == 4" class="mt10" size="small" @click="handleDownload(item)"> 下载 </el-button>
						</div>
					</div>
					<p class="f14 text-gray">{{ item.content }}</p>
				</li>
				<li>
					<el-button text type="primary" @click="handleMore"
						>查看更多
						<el-icon>
							<icon-right theme="outline" size="24" />
						</el-icon>
					</el-button>
				</li>
			</ul>
		<el-empty v-else description="无数据" />

		<el-dialog v-model="visibleForm" title="详情" width="65%" append-to-body :close-on-click-modal="false">
			<template v-if="visibleForm">
				<ReceiveAppeal v-if="api == 'view_dpExceptionAppeal_page'" :nowRowData="nowRowData" @refresh="handleRefresh"> </ReceiveAppeal>
				<ReceiveGather v-if="api == 'view_dpGatherForm_page'" :dataType="nowRowData.dataType" :nowRowData="nowRowData" @refresh="handleRefresh">
				</ReceiveGather>
				<ReceiveChange v-if="api == 'view_dpDataChange_page'" :nowRowData="nowRowData" @refresh="handleRefresh"> </ReceiveChange>
			</template>
		</el-dialog>
	</div>
</template>

<script setup lang="ts">
import { ElMessage } from 'element-plus'
import apiMod from '@/apiMod'
import FileSaver from 'file-saver'
import ReceiveAppeal from '@/views/dataWarehouse/appeal/receive/index.vue'
import ReceiveGather from '@/views/dataWarehouse/dataGather/DetailPage/index.vue'
import ReceiveChange from '@/views/dataWarehouse/dataChange/receive/index.vue'
import TagList from '@/views/aplid/DetailPage/ContentListItem/TagList/index.vue'
import { onDownloadFile } from '@/utils/util'

type Props = {
	api: string
	dataType?: string | number
	activeName?: string | number
}
const props = withDefaults(defineProps<Props>(), {
	dataType: 1,
})
const router = useRouter()
const visibleForm = ref(false)
const dataList = ref([])
const dataTypeStr = {
	1: '养老服务对象',
	2: '养老服务机构',
	3: '社区养老服务设施',
	4: '养老服务运营单位',
	5: '养老从业人员',
	6: '志愿者',
	7: '养老专家',
	8: '服务商',
}
const gatherStatusStr = {
	0: props.api == 'view_dpDataChange_page' ? '变更处理中' : '异常处理中',
	1: '校验中',
	2: '对比中',
	3: '入库中',
	4: '入库失败',
}

const tagType: any = {
	0: 'warning',
	1: 'success',
	2: 'success',
	3: 'success',
	4: 'danger',
}
const pageReac = ref({
	current: 1,
	size: 5,
	total: 0,
})
const nowRowData = ref({
	dataType: 1,
})
const handleShowDetail = (item) => {
	nowRowData.value = item
	if (item.batchNumber || item.id) {
		visibleForm.value = true
	}
}

const getTagConig = (item) => {
	const label = gatherStatusStr[item.gatherStatus | item.appealStatus]
	const type = tagType[item.gatherStatus | item.appealStatus]
	const config = {
		value: label,
		item: {
			dicData: [{ label: label, value: label, type }],
		},
	}
	return config
}

const handleMore = () => {
  const str = {
    view_dpGatherForm_page:'/dataWarehouse/dataGather/index',
    view_dpExceptionAppeal_page:'/dataWarehouse/appeal/index',
    view_dpDataChange_page:'/dataWarehouse/dataChange/index',
  }
	router.push(str[props.activeName])
}

const getInitData = () => {
	const query = {
		gatherStatusList: [1, 2, 3, 4, 5],
		appealStatus: 0,
		processingStatus: 0,
		pageParaPO: pageReac.value,
		dataType: props.dataType,
	}
	apiMod[props.api](query).then((res) => {
		const data = res.data
		dataList.value = data.records.map((item) => {
			item.dataTypeName = dataTypeStr[item.dataType] || '服务对象'
			return item
		})
		pageReac.value.total = data.total
		pageReac.value.size = data.size
		pageReac.value.current = data.current
	})
}

// 下载文件
const handleDownload = (item) => {
	apiMod
		.view_dpDetails_export({
			dataStatusList: [1, 2, 3, 4, 5],
			batchNumber: item.batchNumber || item.id,
		})
		.then((res) => {
			if (res.data) {
        onDownloadFile(res.data)
			} else {
				ElMessage.warning('没有数据')
			}
		})
		.catch((res) => {})
}

const handleRefresh = () => {
	visibleForm.value = false
	getInitData()
}
onMounted(() => {
	getInitData()
})
</script>

<style scoped lang="scss">
.item-box {
	.item {
		border-bottom: 1px solid #eee;
		margin: 6px 0;
		padding: 4px;
	}
}
</style>
